<template>
    <div class="Grid">
      <!-- <TreeFilter></TreeFilter>   -->
      <div class="table-box">
        <div class="headerBar">
          
        </div>
        <ProTable :isShowSearch="false" :staffInfoData="staffInfoData" @openDoor="openDoor" @openAddDoor="openAddDoor">
          <!-- 表格 header 按钮 -->
        
        </ProTable>
      </div>
    </div>
    <UserUpload ref="userY" @uploadSuccess="uploadSuccess"></UserUpload>
    <!-- <IdenUpload ref="Iden" @succCallback="SuccCallback"></IdenUpload> -->
  </template>
  
  <script setup>
// //   import TreeFilter from "@/components/TreeFilter/index.vue";
  import ProTable from "@/components/Protable/shopindex.vue";
  import SelectFilter from "@/components/SelectFilter/index.vue"
//   import UserUpload from '@/views/staff/components/userUpload.vue'
  import UserUpload from '@/views/user/userUpload.vue'
// //   import IdenUpload from "@/components/idenUpload.vue";
  import { CirclePlus, Delete, EditPen, Download, Upload, View, Refresh } from "@element-plus/icons-vue";
  import { ref, onMounted, computed, watchEffect, getCurrentInstance, onBeforeUnmount, reactive } from "vue"
  // import { staffData } from "@/stores/staff.js"
  import { userManage } from "@/stores/user.js"
//   import { mainStore } from "@/stores"
  
//   let { proxy } = getCurrentInstance()
// //   let mStaff = staffData()
//   let mStore = mainStore()
    let usermanage = userManage()
//   增加员工的实例
  let userY = ref()
  // let staffInfoData = reactive() ;//用户的数据

//   // 员工身份设置的实例
//   let Iden = ref()
//   // 权限
//   let power = ref(0)
//   let take = ref(10)
//   let current = ref(1)
//   // 获取员工数据的函数
// //   let getStatffInfo = () => {
// //     let data = {
// //       staff_id: mStore.userinfo.identity.staff_id,
// //       power: power.value,
// //       current: current.value,
// //       take: take.value
// //     }
  
// //     // console.log(data,"这是发给后台的数据")
// //     let res = mStaff.getStaff(data)
// //     mStaff.getPowerListData()
// //   }
  
  
//   let getDiffePower = (e) => {
//     power.value = e
//     getStatffInfo()
//   }
  
//   // 上传成功的回调
  let uploadSuccess = () => {
    usermanage.getUserData()
  }
  
//   // 修改成功的回调
//   let SuccCallback = () => {
//     getStatffInfo()
//   }
  
//   // 添加新员工数据 
  let addStaffData = () => {
    userY.value.acceptParams(true)
  }
  
//   //打开设置员工身份的拉窗  方法是表格中触发的
  let openDoor = () => {
    // Iden.value.openDoorTrue(true)
  }
  
  let openAddDoor = () => {
    userY.value.acceptParams(true)
  }
  
  let staffInfoData = computed(() => {
    // return mStaff.staffInfo
    // console.log("啦啦啦啦")
    

     return usermanage.shopListData
  })
  
//   //一页多少数据
//   let changeSizePage = (size) => {
//     take.value = size
//     current.value = 1
//     getStatffInfo()
//   }
//   //当前是第几页
//   let changeCurrentPage = (cur) => {
  
//     current.value = cur
//     getStatffInfo()
//   }
  
  onMounted(() => {
    // getStatffInfo()
    // staffInfoData = usermanage.userinfo
    usermanage.getAllShopData()
    // usermanage.getUserData()
    // staffInfoData = usermanage.userinfo

    // console.log(staffInfoData,"挂在的时候就调用了")
    // console.log(usermanage)
    // 监听分页的事件
    // proxy.$Bus.on("changeCurrentPage", changeCurrentPage)
    // proxy.$Bus.on("changeSizePage", changeSizePage)
  })
  
//   onBeforeUnmount(() => {
//     // proxy.$Bus.off("changeCurrentPage", changeCurrentPage)
//     // proxy.$Bus.off("changeSizePage", changeSizePage)
//   })
  </script>
  
  <style lang="scss" scoped>
  .Grid {
    width: 100%;
    display: flex;
    // height: calc(100vh - 142px);
  
    .table-box {
      width: 100%;
      box-sizing: border-box;
      height: calc(100vh - 142px);
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      grid-template-rows: auto 1fr;
      margin-left: 5px;
      .headerBar {}
  
    }
  }
  </style>

